<!-- 空白页面参考模版 -->
{extend name='public/base' /}
{block name='content'}
{include file='public/content_header' /}

<section class="content">
    <!-- 这里写内容即可 -->
    <!--数据概览参考1-->

    <!--图标统计参考1-->
    <div class="row">
    <div class="row">
    <div class="col-md-12">
        <div class="card">
            <div class="card-header dataSearch">
                <form class="form-inline searchForm" id="searchForm" action="" method="GET">
<div class="input-group input-group-sm searchGroup smallSelect" style="width:250px !important;">
    <select name="parent_id" id="parent_id" class="form-control input-sm index-search">
        <option value="">分类</option>
        {foreach name='parent_list' id='item'}
        <option value="{$item.id}" {if isset($parent_id) && ''!==$parent_id && $parent_id==$item.id}selected{/if}>{$item.name}</option>
        {/foreach}
    </select>
</div>
<script>
    $(function () {
        $('#parent_id').select2({
        width:'100%'
        });
    });
</script>
<div class="input-group input-group-sm searchGroup smallSelect" style="width:250px !important;">
    <select name="type_id" id="type_id" class="form-control input-sm index-search">
        <option value="">商品</option>
        {foreach name='type_list' id='item'}
        <option value="{$item.id}" {if isset($type_id) && ''!==$type_id && $type_id==$item.id}selected{/if}>{$item.name}</option>
        {/foreach}
    </select>
</div>
<script>
    $(function () {
        $('#type_id').select2({
        width:'100%'
        });
    });
</script>
                    
<div class="input-group input-group-sm searchGroup smallSelect" style="width:250px !important;">
    <select name="user_id" id="user_id" class="form-control input-sm index-search">
        <option value="">供应商</option>
        {foreach name='user_list' id='item'}
        <option value="{$item.id}" {if isset($user_id) && ''!==$user_id && $user_id==$item.id}selected{/if}>{$item.nickname}</option>
        {/foreach}
    </select>
</div>
<script>
    $(function () {
        $('#user_id').select2({
        width:'100%'
        });
    });
</script>
<div class="input-group input-group-sm searchGroup">
    <input value="{$create_time|default=''}" readonly name="create_time" id="create_time" class="form-control input-sm indexSearchDatetimeRange" placeholder="日期">
</div>
<script>
    laydate.render({
        elem: '#create_time',
        type: 'date',
        range: true,
    });
</script>

                    

                    <div class="form-group searchGroup">
                        <button class="btn btn-sm btn-primary" type="submit"><i class="fa fa-search"></i> 查询
                        </button>
                    </div>
                    
                    <div class="form-group searchGroup">
                        <button onclick="clearSearchForm()" class="btn btn-sm btn-default" type="button"><i
                                class="fa  fa-eraser"></i> 清空查询
                        </button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
    <div class="col-md-12">
        <!-- LINE CHART -->
        <div class="card card-info">
            <div class="card-header">
                <h3 class="card-title">年度招标量</h3>

                
            </div>
            <div class="card-body">
                <div class="chart">

                    <div id="chart11" style="width: 100%;min-height: 380px;">

                    </div>

                </div>
            </div>
        </div>

    </div>

    <div class="col-md-12">
        <!-- LINE CHART -->
        <div class="card card-info">
            <div class="card-header">
                <h3 class="card-title">季度招标量</h3>

                
            </div>
            <div class="card-body">
                <div class="chart">

                    <div id="chart12" style="width: 100%;min-height: 380px;">

                    </div>

                </div>
            </div>
        </div>

    </div>
    <div class="col-md-12">
        <!-- LINE CHART -->
        <div class="card card-info">
            <div class="card-header">
                <h3 class="card-title">月度招标量</h3>

                
            </div>
            <div class="card-body">
                <div class="chart">

                    <div id="chart13" style="width: 100%;min-height: 380px;">

                    </div>

                </div>
            </div>
        </div>

    </div>
    <div class="col-md-12">
        <!-- LINE CHART -->
        <div class="card card-info">
            <div class="card-header">
                <h3 class="card-title">同比增长</h3>

                
            </div>
            <div class="card-body">
                <div class="chart">

                    <div id="chart14" style="width: 100%;min-height: 380px;">

                    </div>

                </div>
            </div>
        </div>

    </div>
    <div class="col-md-12">
        <!-- LINE CHART -->
        <div class="card card-info">
            <div class="card-header">
                <h3 class="card-title">环比增长</h3>

                
            </div>
            <div class="card-body">
                <div class="chart">

                    <div id="chart15" style="width: 100%;min-height: 380px;">

                    </div>

                </div>
            </div>
        </div>

    </div>
    <div class="col-md-12">
        <!-- LINE CHART -->
        <div class="card card-info">
            <div class="card-header">
                <h3 class="card-title">供应商年供货量</h3>

                
            </div>
            <div class="card-body">
                <div class="chart">

                    <div id="chart16" style="width: 100%;min-height: 380px;">

                    </div>

                </div>
            </div>
        </div>

    </div>
    <div class="col-md-12">
        <!-- LINE CHART -->
        <div class="card card-info">
            <div class="card-header">
                <h3 class="card-title">供应商季度供货量</h3>

                
            </div>
            <div class="card-body">
                <div class="chart">

                    <div id="chart17" style="width: 100%;min-height: 380px;">

                    </div>

                </div>
            </div>
        </div>

    </div>
</div>

<script>
    $(function (){
        let chartDom = document.getElementById('chart11');
        let myChart = echarts.init(chartDom);
        let option;

        option = {
  
          tooltip: {
            trigger: 'axis'
          },
          
          grid: {
            left: '3%',
            right: '4%',
            bottom: '3%',
            containLabel: true
          },
          // toolbox: {
          //   feature: {
          //     saveAsImage: {}
          //   }
          // },
          xAxis: {
            type: 'category',
            boundaryGap: false,
            data: {$year_time|raw}
          },
          yAxis: {
            type: 'value'
          },
          series: [
            {
            {if isset($parent_id)}
              name: '{$year_data[0]['parent']['name']|default=''}',
              {else}
              name: '{$year_data[0]['type']['name']|default=''}',
              {/if}
              type: 'line',
              stack: 'Total',
              data: {$year_list|raw}
            },
          ]
        };

        option && myChart.setOption(option);
    });
    $(function (){
        let chartDom = document.getElementById('chart12');
        let myChart = echarts.init(chartDom);
        let option;

        option = {
  
          tooltip: {
            trigger: 'axis'
          },
          
          grid: {
            left: '3%',
            right: '4%',
            bottom: '3%',
            containLabel: true
          },
          // toolbox: {
          //   feature: {
          //     saveAsImage: {}
          //   }
          // },
          xAxis: {
            type: 'category',
            boundaryGap: false,
            data: {$ji_time|raw}
          },
          yAxis: {
            type: 'value'
          },
          series: [
            {
            {if isset($parent_id)}
              name: '{$ji_data[0]['parent']['name']|default=''}',
              {else}
              name: '{$ji_data[0]['type']['name']|default=''}',
              {/if}
              type: 'line',
              stack: 'Total',
              data: {$ji_list|raw}
            },
          ]
        };

        option && myChart.setOption(option);
    });
    $(function (){
        let chartDom = document.getElementById('chart13');
        let myChart = echarts.init(chartDom);
        let option;

        option = {
  
          tooltip: {
            trigger: 'axis'
          },
          
          grid: {
            left: '3%',
            right: '4%',
            bottom: '3%',
            containLabel: true
          },
          // toolbox: {
          //   feature: {
          //     saveAsImage: {}
          //   }
          // },
          xAxis: {
            type: 'category',
            boundaryGap: false,
            data: {$month_time|raw}
          },
          yAxis: {
            type: 'value'
          },
          series: [
            {
            {if isset($parent_id)}
              name: '{$month_data[0]['parent']['name']|default=''}',
              {else}
              name: '{$month_data[0]['type']['name']|default=''}',
              {/if}
              type: 'line',
              stack: 'Total',
              data: {$month_list|raw}
            },
          ]
        };

        option && myChart.setOption(option);
    });
    $(function (){
        let chartDom = document.getElementById('chart14');
        let myChart = echarts.init(chartDom);
        let option;

        option = {
  
          tooltip: {
            trigger: 'axis'
          },
          
          grid: {
            left: '3%',
            right: '4%',
            bottom: '3%',
            containLabel: true
          },
          // toolbox: {
          //   feature: {
          //     saveAsImage: {}
          //   }
          // },
          xAxis: {
            type: 'category',
            boundaryGap: false,
            data: {$month_time|raw}
          },
          yAxis: {
            type: 'value'
          },
          series: [
            {
            {if isset($parent_id)}
              name: '{$month_data[0]['parent']['name']|default=''}',
              {else}
              name: '{$month_data[0]['type']['name']|default=''}',
              {/if}
              type: 'line',
              stack: 'Total',
              data: {$tong_list|raw}
            },
          ]
        };

        option && myChart.setOption(option);
    });
    $(function (){
        let chartDom = document.getElementById('chart15');
        let myChart = echarts.init(chartDom);
        let option;

        option = {
  
          tooltip: {
            trigger: 'axis'
          },
          
          grid: {
            left: '3%',
            right: '4%',
            bottom: '3%',
            containLabel: true
          },
          // toolbox: {
          //   feature: {
          //     saveAsImage: {}
          //   }
          // },
          xAxis: {
            type: 'category',
            boundaryGap: false,
            data: {$month_time|raw}
          },
          yAxis: {
            type: 'value'
          },
          series: [
            {
            {if isset($parent_id)}
              name: '{$month_data[0]['parent']['name']|default=''}',
              {else}
              name: '{$month_data[0]['type']['name']|default=''}',
              {/if}
              type: 'line',
              stack: 'Total',
              data: {$huan_list|raw}
            },
          ]
        };

        option && myChart.setOption(option);
    });
    $(function (){
        let chartDom = document.getElementById('chart16');
        let myChart = echarts.init(chartDom);
        let option;

        option = {
  
          tooltip: {
            trigger: 'axis'
          },
          
          grid: {
            left: '3%',
            right: '4%',
            bottom: '3%',
            containLabel: true
          },
          // toolbox: {
          //   feature: {
          //     saveAsImage: {}
          //   }
          // },
          xAxis: {
            type: 'category',
            boundaryGap: false,
            data: {$year_time|raw}
          },
          yAxis: {
            type: 'value'
          },
          series: [
            {
            {if isset($parent_id)}
              name: '{$year_data[0]['parent']['name']|default=''}',
              {else}
              name: '{$year_data[0]['type']['name']|default=''}',
              {/if}
              type: 'line',
              stack: 'Total',
              data: {$year_list_user|raw}
            },
          ]
        };

        option && myChart.setOption(option);
    });
    $(function (){
        let chartDom = document.getElementById('chart17');
        let myChart = echarts.init(chartDom);
        let option;

        option = {
  
          tooltip: {
            trigger: 'axis'
          },
          
          grid: {
            left: '3%',
            right: '4%',
            bottom: '3%',
            containLabel: true
          },
          // toolbox: {
          //   feature: {
          //     saveAsImage: {}
          //   }
          // },
          xAxis: {
            type: 'category',
            boundaryGap: false,
            data: {$ji_time|raw}
          },
          yAxis: {
            type: 'value'
          },
          series: [
            {
            {if isset($parent_id)}
              name: '{$ji_data[0]['parent']['name']|default=''}',
              {else}
              name: '{$ji_data[0]['type']['name']|default=''}',
              {/if}
              type: 'line',
              stack: 'Total',
              data: {$ji_list_user|raw}
            },
          ]
        };

        option && myChart.setOption(option);
    });
</script>


</section>

{/block}